<template>
  <view class="login">
    <Navigation backType="close"/>
    <view class="f fd-c ai-c mt-151">
      <view class="logo w-160 h-160 f jc-c ai-c">
        <image src="http://cwht.ricecs.cn/app/login/logo.png" class="w-130 h-130"></image>
      </view>
      <!--#ifdef APP-PLUS-->
      <view class="fs-60 mt-40 fw-800 text-color1">182****2015</view>
      <view class="mt-16 fs-24 text-color2">中国移动提供认证服务</view>
      <!--#endif-->
      <view class="mt-120 f ai-c">
        <u-checkbox-group @change="getAgree">
          <u-checkbox v-model="isAgree" shape="circle" size="15" activeColor="#FABB3C"></u-checkbox>
        </u-checkbox-group>
        <view class="fs-22 text-color3 f"
        >登录即表示同意
          <view class="text-color" @click.stop='toText(6)'>《用户协议》</view>
          和
          <view class="text-color" @click.stop='toText(7)'>《隐私协议》</view>
        </view>
      </view>
      <view class="w-654 h-96 mt-92">
        <u-button
            text="本机号码一键登录"
            color="#FABB3C"
            shape="circle"
            open-type="getPhoneNumber"
            @getphonenumber="getphonenumber"
            v-if="isAgree"
        ></u-button>
        <u-button text="本机号码一键登录" color="#FABB3C" shape="circle" disabled v-if="!isAgree"></u-button>
      </view>
      <view class="fs-26 text-color mt-40" @click="toTelLogin">其他手机号码登录</view>
      <!--#ifdef APP-PLUS-->
      <view class="f ai-c mt-130">
        <view class="heng w-120 h-1"></view>
        <view class="fs-26 mh-10 text-color3">使用其他方式</view>
        <view class="heng w-120 h-1"></view>
      </view>
      <view class="f mt-48">
        <image src="http://cwht.ricecs.cn/app/login/wx.png" class="w-52 h-52 mr-48"></image>
        <image src="http://cwht.ricecs.cn/app/login/zfb.png" class="w-52 h-52"></image>
      </view>
      <!--#endif-->
    </view>
  </view>
</template>
<script setup lang="ts">
import {ref} from 'vue';
import {userIsNew} from '@/services/api/auth';
import {useAuthStore} from '@/store/modules/auth';

const authStore = useAuthStore();
const isAgree = ref(false);

//登录
function getphonenumber(e: any) {
  uni.login({
    provider: 'weixin',
    success: async (res) => {
      console.log({phoneCode: e.detail.code, loginCode: res.code});
      await authStore.login({phoneCode: e.detail.code, loginCode: res.code}, 1);
      await authStore.getUserInfos();
      //是否是新用户
      let isNew = await userIsNew(authStore.getUserId);
      if (isNew.data) {
        uni.navigateTo({url: '/pages_login/petStatus'});

      } else {
        uni.switchTab({
          url: '/pages/index/index',
        });
      }

    },
  });
}

function getAgree() {
  console.log(11);
  isAgree.value = !isAgree.value;
}

const toTelLogin = () => {
  uni.navigateTo({
    url: '/pages_login/telLogin',
  });
};

function toText(type: number) {
  uni.navigateTo({
    url: '/pages_mine/text?type=' + type,
  });
}
</script>
<style lang="scss" scoped>
.login {
  background: #ffffff;

  .logo {
    background: #fabb3c;
    border-radius: 50%;
  }

  ::v-deep .u-button__text {
    font-size: 36rpx !important;
    font-weight: 600 !important;
  }

  ::v-deep .u-button {
    height: 96rpx !important;
  }

  .heng {
    background: #999999;
  }
}
</style>
